<template>
	<view class="grey text " :class="$tm.vx.state().tmVuetify.black ? 'black bk' : ''" :style="{ height: bodyHeight + 'px' }">
		<tm-menubars title="购物车商品操作列表" color="bg-gradient-primary-lighten" :showback="true"></tm-menubars>
		<tm-sheet :padding="[0, 0]">
			<tm-cartCellListFood border="" :mdata="test" :cart-num.sync="test.buy"></tm-cartCellListFood>
			<tm-cartCellListFood border="" :mdata="test" :cart-num.sync="test.buy"></tm-cartCellListFood>
			<tm-cartCellListFood border="" :black="true" :mdata="test" :cart-num.sync="test.buy"></tm-cartCellListFood>
			<tm-cartCellListFood border="" :black="true" :mdata="test" :cart-num.sync="test.buy"></tm-cartCellListFood>
		</tm-sheet>
	</view>
</template>

<script>
/**
 * 实例不同于外卖（原生app），直接显示所有列表，为了不卡，
 * 每次点击类目都是重新加载数据列表，只显示一列，不显示所有。
 */
	import tmCartCellListFood from "@/tm-vuetify/components/tm-cartCellListFood/tm-cartCellListFood.vue"
	import tmMenubars from "@/tm-vuetify/components/tm-menubars/tm-menubars.vue"
	import tmFullView from "@/tm-vuetify/components/tm-fullView/tm-fullView.vue"
	import tmSheet from "@/tm-vuetify/components/tm-sheet/tm-sheet.vue"
	export default {
		components:{tmCartCellListFood,tmMenubars,tmFullView,tmSheet},
	data() {
		return {
			test: {
				img: 'https://picsum.photos/300?k=1',
				title: '产品3（任选）',
				label: '这个产品是只有几个融会',
				price: 36.2,
				salePrice: 76.4,
				saleLabel: ['7折优惠', '首单减3元'],
				unit: '/斤',
				id: 3,
				buy: 0,
				itemId: 0
			},
			bodyHeight: 50
		};
	},
	mounted() {
		let sy = uni.getSystemInfoSync();
		this.bodyHeight = sy.windowHeight;
	},
	methods: {}
};
</script>

<style></style>
